Ce module passe des chemins statiques aux outils dynamiques pilotés par des événements en manipulant le CanvasRenderingContext2D état. Nous nous concentrons sur l'extension des fonctionnalités de l'application grâce aux modèles de haut niveau et au filtrage mathématique.
1. Modèles d'outils de haut niveau
Des outils comme tools.Line abstrait les événements souris en utilisant des aides comme trackDrag. En revanche, tools.Spray met en œuvre répétition basée sur des intervalles via setInterval, permettant une placement continu de pixels tant que le bouton de la souris est maintenu.
2. Contraintes mathématiques
Un décalage aléatoire simple crée une distribution carrée. Pour obtenir un effet de pinceau naturel en cercle, nous utilisons le théorème de Pythagore pour filtrer les points : $x^2 + y^2 < r^2$. Sinon, on pourrait utiliser les coordonnées polaires avec Math.sin et Math.cos pour la conversion.
3. Opérations composites et état
Au-delà des traits standards, la propriété globalCompositeOperation définit comment les nouveaux pixels interagissent avec les anciens. Par exemple, en la définissant sur 'destination-out' permet à l'outil tools.Erase de rendre les pixels transparents plutôt que simplement les peindre en blanc. Les contrôles d'interface comme controls.color et controls.brushSize fournissent des mises à jour en temps réel de fillStyle et lineWidth respectivement.
lineCap contrôle la forme des extrémités des lignes tracées, essentielle pour un dessin fluide.